<template>
	<div>
		<!-- 头部 -->

		<Head class="head" :data="searchList"></Head>

		<div class="wrap">
			<div class="title">
				<div :class="isSelect == 'index' ? 'select' : ''" @click="handSel('index')">首页</div>
				<div :class="isSelect == 'set' ? 'select' : ''" @click="handSel('set')">账户设置</div>
			</div>
		</div>
		<div v-if="isSelect == 'index'" class="content">
			<!-- 左侧导航栏 -->
			<div class="content-left">
				<div>
					<div class="content-title">订单中心</div>
					<div @click="selectTrigger('order')" :class="select == 'order' ? 'content-list-sel' : ''"
						class="content-list ">我的订单</div>
					<div @click="selectTrigger('sale')" :class="select == 'sale' ? 'content-list-sel' : ''"
						class="content-list">退换/售后</div>
					<div @click="selectTrigger('address')" :class="select == 'address' ? 'content-list-sel' : ''"
						class="content-list">收货地址</div>
				</div>
				<div>
					<div class="content-title">关注中心</div>
					<div @click="selectTrigger('collect')" :class="select == 'collect' ? 'content-list-sel' : ''"
						class="content-list">我的收藏</div>
					<div @click="selectTrigger('footprint')" :class="select == 'footprint' ? 'content-list-sel' : ''"
						class="content-list">我的足迹</div>
				</div>
				<div>
					<div class="content-title">资产中心</div>
					<div @click="selectTrigger('wallet')" :class="select == 'wallet' ? 'content-list-sel' : ''"
						class="content-list">我的钱包</div>
					<div @click="selectTrigger('integral')" :class="select == 'integral' ? 'content-list-sel' : ''"
						class="content-list">我的积分</div>
					<div @click="selectTrigger('coupon')" :class="select == 'coupon' ? 'content-list-sel' : ''"
						class="content-list">优惠劵</div>
					<!-- <div @click = "selectTrigger('earnings')" :class = "select == 'earnings'?'content-list-sel': ''" class = "content-list">收益返利</div> -->
				</div>
			</div>
			<!-- 我的订单 -->
			<div class="content-right" v-if="select == 'order'">
				<div style="    position: relative;">
					<div class="order-tab" :class="isOrderSel == 0 ? 'tabSel' : ''" @click="orderTab(0)">全部订单</div>
					<div class="order-tab" :class="isOrderSel == 1 ? 'tabSel' : ''" @click="orderTab(1)">待付款</div>
					<div class="order-tab" :class="isOrderSel == 2 ? 'tabSel' : ''" @click="orderTab(2)">待发货</div>
					<div class="order-tab" :class="isOrderSel == 3 ? 'tabSel' : ''" @click="orderTab(3)">待收货</div>
					<div class="order-tab" :class="isOrderSel == 4 ? 'tabSel' : ''" @click="orderTab(4)">待评价</div>
				</div>
				<div>
					<table class="form" v-for="(item, index) in orderList" :key="index">
						<thead>
							<tr>
								<th width="42%">宝贝信息</th>
								<th width="10%">单价(元)</th>
								<th width="8">数量</th>
								<th width="10%">实付款</th>
								<th width="10%">交易状态</th>
								<th width="10%">交易操作</th>
							</tr>
						</thead>
						<tbody id="cart-goods-list">
							<tr>
								<td colspan="5">{{ item.createAt }} 订单号：{{ item.orderNum }}</td>
								<td v-if="item.status > 3" class="but-del"><i @click="delOrder(item)"
										class="el-icon-delete"></i></td>
							</tr>
							<tr>
								<td class="goods">
									<div class="goods-image">
										<img :src="item.img ? item.img : '../../../static/images/order/1.png'">
									</div>
									<div class="goods-information">
										<h4>{{ item.title }}</h4>
										<div v-if="item.detailJson">商品规格:{{ item.detailJson }}</div>
									</div>
								</td>
								<td>
									<strong class="price">{{ DollarSignValue }}<em class="price-em">{{
										getProportion(item.price) }}</em></strong>
								</td>
								<td>
									<strong class="amount">{{ item.number }}</strong>
								</td>
								<td>
									<strong class="amount">{{ DollarSignValue }}<em class="amount-em">{{
										getProportion(item.payMoney) }}</em></strong>
								</td>
								<td>
									<div class="state">{{ item.statusName }}</div>
									<div class="goodsDet" @click="orderDetails(item.id)">订单详情</div>
								</td>
								<td>
									<div v-if="item.status == 1" @click="cancel(item)" class="buy-again">取消订单</div>
									<div v-if="item.status == 1" @click="againPay(item)" class="buy-again">去支付</div>
									<div v-if="item.status == 2" @click="remind(item)" class="buy-again">提醒发货</div>
									<div v-if="item.status == 3" @click="notarize(item)" class="buy-again">确认收货</div>
									<div v-if="item.status == 4" @click="gopinglun()" class="buy-again">去评价</div>
									<div v-if="item.status == 4" @click="delOrder(item)" class="buy-again">删除订单</div>
								</td>
							</tr>
						</tbody>
					</table>
					<div v-if="orderData.totalElements != 0" style="text-align: center;margin-top: 10px;">
						<el-pagination @current-change="handleCurrentChange" :page-size="size" :current-page="page"
							layout="prev, pager, next" :total="orderData.totalElements">
						</el-pagination>
					</div>
					<el-empty v-if="orderData.totalElements == 0" description="暂无数据"></el-empty>
				</div>
			</div>
			<!-- 退换/售后 -->
			<div class="content-right" v-if="select == 'sale'">
				<!-- <div style="    position: relative;">
					<div class="order-tab" :class="isTabSel=='all'?'tabSel':''" @click="toggleTab('all')">全部订单</div>
					<div class="order-tab" :class="isTabSel=='fukuan'?'tabSel':''" @click="toggleTab('fukuan')">待退款处理
					</div>
					<div class="order-tab" :class="isTabSel=='fahuo'?'tabSel':''" @click="toggleTab('fahuo')">已拒绝退款
					</div>
					<div class="order-tab" :class="isTabSel=='shouhuo'?'tabSel':''" @click="toggleTab('shouhuo')">退款成功
					</div>
					<div class="order-tab" :class="isTabSel=='pingjia'?'tabSel':''" @click="toggleTab('pingjia')">退款取消
					</div>
				</div> -->
				<div>
					<table class="form" v-for="(item, index) in saleList.content" :key="index">
						<thead>
							<tr>
								<th width="48%">宝贝信息</th>
								<th width="10%">实付金额</th>
								<th width="13%">退款金额</th>
								<th width="15%">下单时间</th>
								<th width="14%">退款状态</th>
								<th width="10%">交易操作</th>
							</tr>
						</thead>
						<tbody id="cart-goods-list1">
							<tr>
								<td>订单号：2158924816589616</td>
							</tr>
							<tr>
								<td class="goods">
									<div class="goods-image">
										<img :src="item.img">
									</div>
									<div class="goods-information">
										<h4>{{ item.title }}</h4>
										<div>商品规格:{{ item.detailJson }}</div>
									</div>
								</td>
								<td>
									<strong class="amount">{{ DollarSignValue }}<em class="amount-em">{{
										getProportion(item.payMoney)
											}}</em></strong>
								</td>
								<td>
									<strong class="price">{{ DollarSignValue }}<em class="price-em">{{
										getProportion(item.payMoney)
											}}</em></strong>
								</td>
								<td>
									<div class="combo">
										{{ item.createAt }}
										<!-- <input type="button" name="minus" value="-" class="combo-minus"
											@click="item.pro_num<2?item.pro_num=1:item.pro_num--">
										<input type="text" name="count" v-model.number="item.pro_num"
											class="combo-value">
										<input type="button" name="plus" value="+" class="combo-plus"
											@click="item.pro_num++"> -->
									</div>
								</td>
								<td>
									<strong class="amount">
										<!-- ￥
										<em class="amount-em">{{ (item.payMoney * item.number).toFixed(2) }}</em> -->
										<div class="state" v-if="item.status == 6">退款中</div>
										<div class="state" v-if="item.status == 7">已退款</div>
										<div class="state" v-if="item.status == 8">拒绝退款</div>
									</strong>
								</td>
								<td>
									<div class="goodsDet" @click="orderDetails(item.id)">订单详情</div>
								</td>
							</tr>
						</tbody>
					</table>
					<div style="text-align: center;margin-top: 10px;" v-if="saleList.totalElements">
						<el-pagination @current-change="saleChange" layout="prev, pager, next" :page-size="size"
							:current-page="page" :total="saleList.totalElements"></el-pagination>
					</div>
					<el-empty v-if="saleList.totalElements == 0" description="暂无数据"></el-empty>
				</div>
			</div>
			<!-- 收货地址 -->
			<div class="" v-if="select == 'address'">
				<div class="content-top">
					<div class="save-address">已保存的收货地址</div>
					<div class="addressDet" v-for="(item, index) in addressList" :key="index">
						<div class="user-msg" style="display: flex">
							<div class="name">
								<img v-if="item.select" src="../../../static/images/order/23.png" alt="">
								<div class="user-name">{{ item.provinces }}( {{ item.consignee }} 收 )</div>
							</div>
							<div class="address"> {{ item.detail }}（ 电话：{{ item.mobile }} ）</div>
						</div>
						<div class="updata-address">
							<i @click="updataAddress(item)" class="el-icon-edit"></i>
							<i @click="deleteAddress(item)" class="el-icon-delete"></i>
						</div>
					</div>
				</div>
				<div class="content-bottom">
					<div class="address-title">新建收货地址</div>
					<el-form ref="form" :model="form" label-width="80px">
						<el-form-item label="收货人">
							<el-input v-model="form.consignee" style="width: 280px"></el-input>
						</el-form-item>
						<el-form-item label="手机号">
							<el-input v-model="form.mobile" style="width: 280px"></el-input>
						</el-form-item>
						<el-form-item label="省市区">
							<el-cascader style="width:280px" size="large" :options="options" ref="cascaderAddr"
								v-model="storeAddress" :placeholder="storeAddre" @change="handleChange"
								:value="storeAddre">
							</el-cascader>
						</el-form-item>
						<el-form-item label="详细地址">
							<el-input type="" v-model="form.detail" style="width: 280px"></el-input>
						</el-form-item>
						<el-form-item label="">
							<el-checkbox-group v-model="form.isDefault">
								<el-checkbox label="设为默认地址" name="default"></el-checkbox>
							</el-checkbox-group>
						</el-form-item>
						<el-form-item>
							<el-button @click="addAddressList" class="save-btn" size="medium">保存</el-button>
						</el-form-item>
					</el-form>
				</div>
			</div>

			<!-- 我的收藏 -->
			<div class="" v-if="select == 'collect'">
				<div class="collect-content">
					<div class="goods-wrap">
						<div class="box" v-for="(item, index) in selectList.content" :key="index"
							@click="onClick(item.goods.id)">
							<img class="goods-img" :src="item.coverImg" alt="">
							<div class="goods-title">{{ item.title }}</div>
							<div class="footer">
								<div class="price">{{ DollarSignValue }}{{ getProportion(item.price) }}</div>
								<div class="num">月销 {{ item.goods ? item.goods.sales : '0' }}</div>
							</div>
						</div>
					</div>
				</div>
				<div v-if="browseList.content.length != 0" style="text-align: center;margin-top: 10px;">
					<el-pagination @current-change="CollectChange" :page-size="8" :current-page="page"
						layout="prev, pager, next" :total="selectList.content.length">
					</el-pagination>
				</div>
				<el-empty v-if="selectList.content.length == 0" description="暂无数据"></el-empty>
			</div>
			<!-- 我的足迹 -->
			<div class="" v-if="select == 'footprint'">
				<div class="collect-content">
					<div class="goods-wrap">
						<div class="box" v-for="(item, index) in browseList.content" :key="index"
							@click="onClick(item.goods.id)">
							<img class="goods-img" :src="item.coverImg" alt="">
							<div class="goods-title">{{ item.title }}</div>
							<div class="footer">
								<div class="price">{{ DollarSignValue }}{{ getProportion(item.price) }}</div>
								<div class="num">月销 {{ item.goods ? item.goods.sales : 0 }}</div>
							</div>
						</div>
					</div>
				</div>
				<div v-if="browseList.content.length != 0" style="text-align: center;margin-top: 10px;">
					<el-pagination @current-change="BrowseChange" :page-size="8" :current-page="page"
						layout="prev, pager, next" :total="browseList.content.length">
					</el-pagination>
				</div>
				<el-empty v-if="browseList.content.length == 0" description="暂无数据"></el-empty>
			</div>

			<!-- 我的钱包 -->
			<div v-if="select == 'wallet'">
				<!-- <empty></empty> -->
				<div class="content-bottom" style="margin: 0px;">
					<div style="display: flex;justify-content: space-between;text-align: center;">
						<div style="width: 150px;">
							<div style="font-size: 20px;font-weight: 700;">{{ getProportion(money) }}</div>
							<div style="font-size: 16px;color: #666666;margin-top: 5px;">我的余额</div>
						</div>
						<div style="width: 150px;">
							<div style="font-size: 20px;font-weight: 700;">{{ getProportion(money) }}</div>
							<div style="font-size: 16px;color: #666666;margin-top: 5px;">可提现金额</div>
						</div>
						<div style="width: 150px;">
							<div style="font-size: 20px;font-weight: 700;">{{ getProportion(money) }}</div>
							<div style="font-size: 16px;color: #666666;margin-top: 5px;">累计提现金额</div>
						</div>
					</div>
				</div>
				<div class="content-bottom">
					<div style="position: relative;">
						<div class="order-tab" :class="isMoneySel == 0 ? 'tabSel' : ''" @click="moneyTab(0)">钱包明细</div>
						<div class="order-tab" :class="isMoneySel == 1 ? 'tabSel' : ''" @click="moneyTab(1)">提现记录</div>
					</div>

					<table class="form" v-if="isMoneySel == 0">
						<thead>
							<tr class="tr_title">
								<th width="15%">类型</th>
								<th width="30%">内容</th>
								<th width="20%">时间</th>
								<th width="10%">金额</th>
							</tr>
						</thead>
						<tbody id="cart-goods-list">
							<tr v-for="(item, index) in walletList.content" :key="index">
								<td class="goods">
									<div class="">{{ item.title }}</div>
								</td>
								<td>
									<div class="">{{ item.content }}</div>
								</td>
								<td>
									<div class="">{{ item.createTime }}</div>
								</td>
								<td>
									<div class="">{{DollarSignValue}}<span class="amount-em">{{ getProportion(item.money) }}</span></div>
								</td>
							</tr>
						</tbody>
					</table>
					<table class="form" v-if="isMoneySel == 1">
						<thead>
							<tr class="tr_title">
								<th width="15%">支付宝姓名</th>
								<th width="15%">支付宝账号</th>
								<th width="30%">申请时间</th>
								<th width="20%">金额</th>
								<th width="20%">状态</th>
							</tr>
						</thead>
						<tbody id="cart-goods-list">
							<tr v-for="(item, index) in cashList" :key="index">
								<td class="goods">
									<div class="">{{ item.zhifubaoName }}</div>
								</td>
								<td>
									<div class="">{{ item.zhifubao }}</div>
								</td>
								<td>
									<div class="">{{ item.createAt }}</div>
								</td>
								<td>
									<div class="">{{DollarSignValue}}<em class="amount-em">{{ getProportion(item.money) }}</em></div>
								</td>
								<td>
									<div class="" v-if="item.state == 0">提现中</div>
									<div class="" v-if="item.state == 1">提现成功</div>
									<div class="" v-if="item.state == -1">提现失败</div>
								</td>
							</tr>
						</tbody>
					</table>
					<div v-if="walletList.totalElements != 0 && isMoneySel == 0"
						style="text-align: center;margin-top: 10px;">
						<el-pagination background @current-change="handleCurrentChange" :page-size="size"
							:current-page="page" layout="prev, pager, next" :total="walletList.totalElements">
						</el-pagination>
					</div>
					<el-empty v-if="walletList.totalElements == 0 && isMoneySel == 0" description="暂无数据"></el-empty>
					<el-empty v-if="cashList.length == 0 && isMoneySel == 1" description="暂无数据"></el-empty>
				</div>
			</div>
			<!-- 我的积分 -->
			<div v-if="select == 'integral'">
				<!-- <empty></empty> -->
				<div class="content-bottom" style="margin: 0px;">
					<div style="display: flex;">
						<div style="width: 150px;text-align: center;">
							<div>我的积分</div>
							<div style="font-size: 18px;font-weight: 700;">{{ jifen }}</div>
						</div>
					</div>
				</div>
				<div class="content-bottom">
					<div style="position: relative;">
						<div class="order-tab tabSel">积分明细</div>
					</div>

					<table class="form">
						<thead>
							<tr class="tr_title">
								<th width="20%">类型</th>
								<th width="40%">内容</th>
								<th width="10%">时间</th>
								<th width="10%">金额</th>
							</tr>
						</thead>
						<tbody id="cart-goods-list">
							<tr v-for="(item, index) in jifenList" :key="index">
								<td class="goods">
									<div class="">{{ item.content }}</div>
								</td>
								<td>
									<div class="">{{ item.des }}</div>
								</td>
								<td>
									<div class="">{{ item.createAt }}</div>
								</td>
								<td>
									<div class="">{{ item.number }}</div>
								</td>
							</tr>
						</tbody>
					</table>

					<el-empty v-if="jifenList.length == 0" description="暂无数据"></el-empty>
				</div>
			</div>
			<!-- 优惠劵 -->
			<div class="content-right" v-if="select == 'coupon'">
				<!-- <empty></empty> -->
				<div style="position: relative;">
					<div class="order-tab" :class="isCouponSel == 1 ? 'tabSel' : ''" @click="couponTab(1)">商品券</div>
					<div class="order-tab" :class="isCouponSel == 2 ? 'tabSel' : ''" @click="couponTab(2)">通用券</div>
				</div>
				<div>
					<table class="form">
						<thead>
							<tr class="tr_title">
								<th width="10%">名称</th>
								<th width="10%">类型</th>
								<th width="15%">满减</th>
								<th width="20%">有效期</th>
								<th width="10%">金额</th>
							</tr>
						</thead>
						<tbody id="cart-goods-list">
							<tr v-for="(item, index) in couponList.content" :key="index">
								<td>
									<div class="">{{ item.couponName }}</div>
								</td>
								<td>
									<div class="" v-if="item.lessMoney == 1">商品券</div>
									<div class="" v-if="item.lessMoney == 2">通用券</div>
								</td>
								<td>
									<div class="">满{{ getProportion(item.minMoney) }}可用</div>
								</td>
								<td>
									<div class="">有效期至{{ item.failureTime }}</div>
								</td>
								<td>
									<div class="">{{DollarSignValue}}<em class="amount-em">{{ getProportion(item.lessMoney) }}</em></div>
								</td>

							</tr>
						</tbody>
					</table>
					<div v-if="couponList.totalElements != 0" style="text-align: center;margin-top: 10px;">
						<el-pagination background @current-change="handleCurrentChange" :page-size="size"
							:current-page="page" layout="prev, pager, next" :total="couponList.totalElements">
						</el-pagination>
					</div>
					<el-empty v-if="couponList.totalElements == 0" description="暂无数据"></el-empty>
				</div>
			</div>
			<!-- 收益返利 -->
			<div v-if="select == 'earnings'">
				<!-- <empty></empty> -->
			</div>


		</div>
		<information v-if="isSelect == 'set'"></information>
		<!-- 底部 -->
		<Foots></Foots>
	</div>
</template>

<script>
import goodsItem from "../../components/goods-item";
import Head from '@/components/head.vue'
import Foots from '@/components/foots.vue'
import information from './information.vue'
import {currency } from '../js/currency'
import empty from '@/components/empty.vue'
import {
	CodeToText,
	regionData
} from 'element-china-area-data'
import {
	Loading
} from 'element-ui';

export default {
	name: "order",
	components: {
		Head,
		Foots,
		goodsItem,
		information,
		empty
	},
	data() {
		return {
			searchList: ['粽子', '防晒霜', '洗衣液', '蚊香液', '抽纸', '零食'],
			options: regionData,
			storeAddre: '请选择城市',
			storeAddress: '',
			province: '', //省
			city: '', //市
			district: '', //区
			page: 1,
			size: 5,
			userId: '',
			select: 'order',
			form: {
				consignee: '',
				provinces: '',
				detail: '',
				mobile: '',
				id: '',
				isDefault: 0,
			},
			isTabSel: 'all', //退换售后选择
			collectSel: 'all', //我的收藏选择
			isSelect: 'index',

			isOrderSel: 0, //我的订单选择
			orderStatus: 0, //我的订单状态
			orderList: [], //我的订单列表
			orderData: '', //我的订单数据
			isMoneySel: 0, //我的钱包选择
			isCouponSel: 1, //我的优惠卷选择


			isSaleSel: 0, //退换售后选择
			saleList: {}, //退换售后列表
			addressList: {}, //地址列表
			selectList: {
				content: []
			}, //收藏列表
			browseList: {
				content: []
			}, //足迹列表
			relationId: window.localStorage.getItem('relationId'), //邀请码
			money: '0.00', //可提现金额
			totalMoney: '0.00', //累计提现金额
			walletList: [], //钱包明细
			cashList: [], //提现记录
			jifen: 0,
			jifenList: [], //积分明细
			couponType: 1, //优惠卷类型
			couponList: [], //优惠卷列表
		}
	},
	mounted() {
		if (this.$route.query.select) {
			this.select = this.$route.query.select
		}
		this.userId = this.$cookie.get('userId')
		console.log('aaa--this.userId', this.userId)
		this.selectTrigger(this.select)
	},
	computed:{
		DollarSignValue(){
			// let dollar=this.$store.state.currencyInfo.figure
			let dollar=this.getDollarSign()
			return dollar
		}
	},
	methods: {
		getDollarSign(){
			let dollar=this.$store.state.currencyInfo.figure
			return dollar
		},
		// 金额计算比例
		getProportion(money){
			let proportion=this.$store.state.currencyInfo.scale
			let price=currency(proportion,money)
			// console.error('price-----',price)
			return price
			// return money
		},
		handleChange(value) {
			this.province = CodeToText[value[0]]
			this.city = CodeToText[value[1]]
			this.district = CodeToText[value[2]]
			this.form.provinces = this.province + this.city + this.district
			// this.form.city = CodeToText[value[1]]
			// if (this.city == '市辖区') {
			// 	this.city = this.province
			// }
			// if (this.form.city == '市辖区') {
			// 	this.city = this.province
			// }
		},
		handSel(e) {
			this.isSelect = e
		},
		selectTrigger(e) {
			this.select = e
			this.page = 1
			switch (this.select) {
				case 'order':
					this.getOrderList()
					break;
				case 'sale':
					this.getTuiKuanList()
					break;
				case 'address':
					this.getAddressList()
					break;
				case 'collect':
					this.getCollectList()
					break;
				case 'footprint':
					this.getBrowseList()
					break;
				case 'wallet':
					this.getMoney()
					this.getMoneyList()
					break;
				case 'integral':
					this.getJifen()
					this.getJifenList()
					break;
				case 'coupon':
					this.getCouponList()
					break;
			}
		},
		toggleTab(e) {
			this.isTabSel = e
		},
		btnSel(e) {
			this.collectSel = e
		},
		//订单状态切换
		orderTab(e) {
			this.page = 1
			this.isOrderSel = e
			this.orderStatus = e
			this.getOrderList()
		},
		//我的订单分页切换
		handleCurrentChange(val) {
			this.page = val;
			this.getOrderList()
		},
		//退换售后订单分页切换
		saleChange(val) {
			this.page = val;
			this.getTuiKuanList()
		},
		//我的收藏分页切换
		CollectChange(val) {
			this.page = val;
			this.getCollectList()
		},
		//我的足迹分页切换
		BrowseChange(val) {
			this.page = val;
			this.getBrowseList()
		},
		//我的钱包分页切换
		handleCurrentChange(val) {
			this.page = val;
			this.getMoneyList()
		},
		//我的钱包明细切换
		moneyTab(e) {
			this.isMoneySel = e
			if (e == 0) {
				this.page = 1
				this.getMoneyList()
			} else if (e == 1) {
				this.page = 1
				this.getCashList()
			}
		},
		couponTab(e) {
			this.page = 1
			this.isCouponSel = e
			this.couponType = e
			this.getCouponList()
		},

		onClick(id) {
			this.$router.push({
				path: '/productDetails?id=' + id
			})
		},
		//去支付
		againPay(e) {
			this.$router.push({
				path: '/payment?money=' + e.payMoney + '&orderNum=' + e.payNum + '&id=' + e.id
			});
		},
		//取消订单
		cancel(e) {
			this.$confirm('确认取消该订单?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.$http({
					url: this.$http.adornUrl('/orders/cancel'),
					method: 'get',
					params: this.$http.adornParams({
						'id': e.id,
					})
				}).then(({
					data
				}) => {
					if (data.status == 0) {
						this.$message({
							type: 'success',
							message: '订单已取消!'
						});
						this.getOrderList()
					}
				})
			}).catch(() => {

			});
		},
		//提醒发货
		remind(e) {
			this.$http({
				url: this.$http.adornUrl('/orders/remind?ordersId=' + e.id),
				method: 'get',
				params: this.$http.adornParams({
					// 'ordersId': e.ordersId,
				})
			}).then(({
				data
			}) => {
				if (data.status == 0) {
					this.$message({
						type: 'success',
						message: '已提醒商家及时发货!'
					});
				}
			})
		},
		//确认收货
		notarize(e) {
			this.$http({
				url: this.$http.adornUrl('/orders/confirm'),
				method: 'get',
				params: this.$http.adornParams({
					'id': e.id,
				})
			}).then(({
				data
			}) => {
				if (data.status == 0) {
					this.$message({
						type: 'success',
						message: '已确认!'
					});
				}
				this.getOrderList()
			})
		},
		// 去评价
		gopinglun() {
			this.$router.push({
				path: '/empty'
			})
		},
		//删除订单
		delOrder(e) {
			this.$confirm('确认删除该订单?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.$http({
					url: this.$http.adornUrl('/orders/delete'),
					method: 'get',
					params: this.$http.adornParams({
						'id': e.id,
					})
				}).then(({
					data
				}) => {
					if (data.status == 0) {
						this.$message({
							type: 'success',
							message: '已删除订单!'
						});
						this.getOrderList()
					}
				})
			}).catch(() => {

			});
		},
		//我的订单数据获取
		getOrderList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('/orders/findMyList'),
				method: 'get',
				params: this.$http.adornParams({
					'page': this.page - 1,
					'size': this.size,
					'userId': this.userId,
					'status': this.orderStatus
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data && data.status === 0) {
					this.orderData = data.data
					data.data.content.forEach(d => {
						if (d.status === 1) {
							d.statusName = '待付款'
						} else if (d.status === 2) {
							d.statusName = '待发货'
						} else if (d.status === 3) {
							if (d.isExpress != 3) {
								d.statusName = '待收货'
							} else {
								d.statusName = '待使用'
							}
						} else if (d.status === 4) {
							d.statusName = '待评价'
						} else if (d.status === 5) {
							d.statusName = '已取消'
						} else if (d.status === 6) {
							d.statusName = '退款中'
						} else if (d.status === 7) {
							d.statusName = '已退款'
						} else if (d.status === 8) {
							d.statusName = '拒绝退款'
						} else if (d.status === 9) {
							d.statusName = '拼团中'
						} else if (d.status === 10) {
							d.statusName = '已评价'
						}
					});
					this.orderList = data.data.content;
				}
			})
		},
		//退换售后数据列表
		getTuiKuanList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('/orders/findMyRefundList'),
				method: 'get',
				params: this.$http.adornParams({
					'page': this.page - 1,
					'size': this.size,
					'userId': this.userId,
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data && data.status === 0) {
					let returnData = data.data
					this.saleList = returnData
				}
			})
		},
		//订单详情跳转
		orderDetails(id) {
			this.$router.push({
				path: '/orderDetails?id=' + id
			})
		},
		//获取地址列表
		getAddressList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('/address/findByUserId'),
				method: 'get',
				params: this.$http.adornParams({
					'userId': this.userId,
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data && data.status === 0) {
					let returnData = data.data
					returnData.forEach(res => {
						if (res.isDefault) {
							res.select = 1
						} else {
							res.select = 0
						}
					})
					this.addressList = returnData
				}
			})
		},
		//添加收货地址
		addAddressList() {
			if (!this.form.consignee) {
				this.$message({
					type: 'error',
					message: '请填写收货人姓名!'
				});
				return
			}
			if (!this.form.mobile) {
				this.$message({
					type: 'error',
					message: '请填写收货人手机号!'
				});
				return
			}
			if (!this.form.provinces) {
				this.$message({
					type: 'error',
					message: '请选择省市区!'
				});
				return
			}
			if (!this.form.detail) {
				this.$message({
					type: 'error',
					message: '请填写详细地址!'
				});
				return
			}
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('/address/save'),
				method: 'post',
				data: this.$http.adornData({
					'userId': this.userId,
					'consignee': this.form.consignee,
					'provinces': this.form.provinces,
					'detail': this.form.detail,
					'mobile': this.form.mobile,
					'id': this.form.id,
					'isDefault': this.form.isDefault ? 1 : 0,
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				this.$message({
					type: 'success',
					message: '添加成功!'
				});
				if (data && data.status === 0) {
					this.form.consignee = ''
					this.form.provinces = ''
					this.form.detail = ''
					this.form.mobile = ''
					this.form.id = ''
					this.form.isDefault = false
					// this.storeAddress = ''
					this.storeAddre = ''
					this.getAddressList()
				}
			})
		},
		//编辑地址
		updataAddress(e) {
			this.form.consignee = e.consignee
			this.storeAddre = e.provinces
			// this.storeAddress = e.provinces
			this.form.provinces = e.provinces
			this.form.detail = e.detail
			this.form.mobile = e.mobile
			this.form.id = e.id
			this.form.isDefault = e.isDefault ? true : false
		},
		//删除地址
		deleteAddress(e) {
			this.$confirm('此操作将永久删除该地址, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				let loadingInstance = Loading.service({
					lock: true,
					text: '加载中……',
					background: 'rgba(0, 0, 0, 0.7)'
				});
				this.$http({
					url: this.$http.adornUrl('/address/delete?id=' + e.id),
					method: 'get',
					params: this.$http.adornParams({})
				}).then(({
					data
				}) => {
					this.$nextTick(() => {
						loadingInstance.close();
					})
					if (data && data.status === 0) {
						this.$message({
							type: 'success',
							message: '删除成功!'
						});
						this.getAddressList()
					}
				})
			}).catch(() => { });
		},
		//获取收藏数据列表
		getCollectList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('/selfUserCollect/list'),
				method: 'get',
				params: this.$http.adornParams({
					'page': this.page - 1,
					'size': 9999,
					'userId': this.userId,
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data && data.status === 0) {
					let returnData = data.data
					let dataLsit = []
					returnData.content.forEach(res => {
						if (res.goods) {
							dataLsit.push(res)
						}
						console.log(dataLsit)
					})


					this.selectList.content = dataLsit
				}
			})
		},
		//获取我的足迹数据列表
		getBrowseList() {
			let that = this
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			that.$http({
				url: that.$http.adornUrl('/selfUserBrowse/list'),
				method: 'get',
				params: that.$http.adornParams({
					'page': that.page - 1,
					'size': 8,
					'userId': that.userId,
				})
			}).then(({
				data
			}) => {
				that.$nextTick(() => {
					loadingInstance.close();
				})
				if (data && data.status === 0) {
					let returnData = data.data
					let dataLsit = []
					returnData.content.forEach(res => {
						if (res.goods) {
							dataLsit.push(res)
						}
					})

					this.browseList.content = dataLsit
				}
			})
		},
		//获取我的钱包
		getMoney() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl("cash/money/" + this.userId),
				method: 'get',
				params: this.$http.adornParams({})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data.status === 0 && data.data) {
					console.log(data.data)
					let money = parseFloat(data.data).toFixed(2);
					this.getwalletMoney(money);
				} else if (data.status === -102) {

				} else {
					this.money = '0.00';
				}
			})
			let relationId = localStorage.getItem("relationId")
			this.$http({
				url: this.$http.adornUrl("cash/countByRelationId/" + relationId),
				method: 'get',
				params: this.$http.adornParams({})
			}).then(({
				data
			}) => {
				if (data.status === 0 && data.data) {
					that.totalMoney = parseFloat(data.data).toFixed(2);
				} else {
					that.totalMoney = '0.00';
				}
			})

		},
		getwalletMoney(money) {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('userMoney/selectUserMoney?userId=' + this.userId),
				method: 'get',
				params: this.$http.adornParams({})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data.status == 0) {
					data.data.money = data.data.money ? data.data.money : 0;
					this.money = parseFloat(parseFloat(money) + parseFloat(data.data.money)).toFixed(2);
					console.log(this.money)
				}
			})
		},
		// 获取钱包明细列表
		getMoneyList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('user/selectUserDetails'),
				method: 'get',
				params: this.$http.adornParams({
					'page': this.page - 1,
					'size': 5,
					'userId': this.userId,
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data.status == 0) {
					this.walletList = data.data
				}
			})
		},
		// 获取提现记录
		getCashList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			let relationId = localStorage.getItem("relationId")
			this.$http({
				url: this.$http.adornUrl('cash/list/' + relationId),
				method: 'get',
				params: this.$http.adornParams({})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data.status == 0) {
					this.cashList = data.data
				}
			})
		},
		// 获取积分
		getJifen() {

			this.$http({
				url: this.$http.adornUrl('user/' + this.userId),
				method: 'get',
				params: this.$http.adornParams({})
			}).then(({
				data
			}) => {
				if (data.status == 0) {
					if (data.data.orderJifen) {
						this.jifen = parseFloat(data.data.orderJifen).toFixed(0);
					}
				}
			})
		},
		// 获取积分明细
		getJifenList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('user/getUserJifenList/' + this.userId),
				method: 'post',
				params: this.$http.adornParams({})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data.status == 0) {
					this.jifenList = data.data
				}
			})
		},
		// 获取优惠卷列表
		getCouponList() {
			let loadingInstance = Loading.service({
				lock: true,
				text: '加载中……',
				background: 'rgba(0, 0, 0, 0.7)'
			});
			this.$http({
				url: this.$http.adornUrl('selfCouponUser/userList'),
				method: 'get',
				params: this.$http.adornParams({
					'page': this.page - 1,
					'size': 5,
					'userId': this.userId,
					'type': this.couponType
				})
			}).then(({
				data
			}) => {
				this.$nextTick(() => {
					loadingInstance.close();
				})
				if (data.status == 0) {
					this.couponList = data.data
				}
			})
		}

	}

}
</script>

<style scoped>
.head {
	background: #fff;
}

.wrap {
	width: 100%;
	height: 42px;
	background: #EA7408;
}

.title {
	width: 1200px;
	margin: 0 auto;
	min-width: 1200px;
	background: #EA7408;
}

.title>div {
	width: 240px;
	display: inline-block;
	text-align: center;
	line-height: 42px;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	background: #EA7408;
}

.title>div:hover {
	cursor: pointer;
}

.select {
	/* background: #E5284C !important; */
}

.el-radio-group.el-radio {}

.content {
	width: 1200px;
	display: flex;
	justify-content: space-between;
	margin: 40px auto;
	background: #F6F5F7;
}

.content>div {
	min-height: 540px;
}

.content-left {
	width: 190px;
	padding: 30px;
	background: #fff;
	border-radius: 6px;
}

.content-left div {}

.content-right {
	width: 880px;
	padding: 30px;
	border-radius: 6px;
	background: #fff !important;
}

.content-right div {
	/*background: #fff;*/
}

.content-top {
	width: 880px;
	padding: 30px;
	border-radius: 6px;
	background: #fff !important;
}

.content-bottom {
	width: 880px;
	padding: 30px;
	border-radius: 6px;
	margin-top: 20px;
	background: #fff !important;
}

.content-title {
	font-size: 18px;
	font-weight: 700;
	color: #333333;
	height: 40px;
	line-height: 40px;
}

.content-list {
	font-size: 16px;
	font-weight: 400;
	color: #333333;
	height: 30px;
	line-height: 30px;
	cursor: pointer;
	margin: 10px 0;
}

.content-list-sel {
	color: #EA7408;
}

.tab {
	font-size: 18px;
	font-weight: 500;
	/*text-align: center;*/
	color: #333333;
	line-height: 40px;
	display: inline-block;
	height: 40px;
	/*width: 90px;*/
	margin-right: 30px;
}

.order-tab {
	font-size: 18px;
	font-weight: 500;
	color: #333333;
	line-height: 40px;
	display: inline-block;
	height: 40px;
	margin-right: 30px;
	cursor: pointer;
}

.tabSel {
	color: #EA7408;
}

.cell {
	background: #fff !important;
}

.save-address {
	color: #333333;
	font-weight: 700;
	font-size: 18px;
}

.user-msg {
	margin: 20px 0;
}

.name {
	position: relative;
	text-align: center;
	line-height: 34px;
}

.name>img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 34px;
}

.user-name {
	margin: 0 8px;
	font-width: 700;
	font-size: 16px;
}

.address {
	line-height: 34px;
	margin-left: 20px;
	color: #999999;
	font-size: 16px;
}

.addressDet {
	display: flex;
	justify-content: space-between;

}

.updata-address {
	font-size: 14px;
	color: #d0a182;
	/*margin-top: 20px;*/
}

.but-del {
	text-align: center !important;
	font-size: 20px;
}

.updata-address>i {
	font-size: 24px;
	margin-left: 20px;
	cursor: pointer;
	margin: 20px 0 20px 20px;
}

.line {
	height: 20px;
	width: 100%;
	background: #F6F5F7;
}

.address-title {
	font-size: 18px;
	color: #333333;
	font-weight: 700;
	padding: 20px;
}

.save-btn {
	width: 120px;
	color: #fff;
	background: #EA7408;
}

.collect-title {
	width: 900px;
	height: 30px;
	padding: 20px;
	display: flex;
	justify-content: space-between;
	background: #fff;
	margin-bottom: 20px;
}

.collect-btn {
	display: flex;
}

.collect-btn>div {
	width: 160px;
	height: 30px;
	line-height: 30px;
	text-align: center;
}

.collect-btn-sel {
	color: #EA7408;
}

.collect-content {
	width: 940px;
}

.goods-wrap {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.box {
	width: 25%;
	/* height: 320px; */
	padding: 20px;
	background: #fff;
	border: 1px solid #F6F5F7;
	box-sizing: border-box;
	margin-bottom: 10px;
}

.goods-img {
	width: 100%;
	height: 200px;
	border-radius: 5px;
}

.goods-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	height: 42px;
}

.footer {
	display: flex;
	justify-content: space-between;
	margin-top: 8px;
}

.price {
	font-weight: 700;
	color: #EA7408;
}

.num {
	font-size: 12px;
	color: #666666;
	font-weight: 400;
	line-height: 30px;
}

table tr {
	border: 1px solid #f6f5f7;
}

table.form {
	border-collapse: collapse;
	empty-cells: show;
	margin: 20px 0px;
	padding: 0px;
	table-layout: fixed;
	width: 100%;
}

/*table.form th,*/
table.form td {
	padding: 15px 10px;
	text-align: left;
}

table.form th {
	text-align: left;
	padding: 5px 10px;
	background: #F6F5F7;
}

.goods {
	/*width: 100%;*/
}

.goods .goods-image img {
	border: 1px solid #DDDDDD;
	float: left;
	width: 100px;
	height: 100px;
	margin: 0px 20px 0px 0px;
}

.goods .goods-information {
	float: left;
	width: 240px;
}

.goods .goods-information h4 {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.goods .goods-information div {
	color: #666666;
	font-size: 15px;
	line-height: 20px;
	margin: 10px 0px 0px 0px;
}

.price,
.amount,
#total-amount {
	/*color: #E00000;*/
}

#total-amount {
	font-size: 22px;
	color: #EA7408;
}

.price em,
.amount em,
#total-amount em {
	font-style: normal;
}

.combo .combo-minus,
.combo .combo-value,
.combo .combo-plus {
	background: #FFFFFF;
	border: 1px solid #DDDDDD;
	color: #333333;
	float: left;
	font-weight: bold;
	margin: 0px;
	outline: none;
	text-align: center;
}

.combo .combo-minus,
.combo .combo-plus {
	font-size: 16px;
	height: 26px;
	line-height: 26px;
	padding: 0px;
	width: 24px;
}

.combo .combo-value {
	border-left: none;
	border-right: none;
	height: 20px;
	line-height: 20px;
	padding: 2px;
	width: 40px;
}

#cart-delete {
	margin-left: 20px;
}

#settlement {
	background: #E00000;
	border: none;
	color: #FFFFFF;
	float: right;
	font-size: 16px;
	height: 40px;
	line-height: 40px;
	margin: 0px;
	outline: none;
	padding: 0px;
	width: 160px;
}

.appraise {
	padding: 3px 0;
	text-align: center;
	border: 1px solid #dddddd;
}

.state {
	color: #999999;
}

.goodsDet {
	color: #333333;
	margin-top: 4px;
	cursor: pointer;
}

.buy-again {
	text-align: center;
	color: #333333;
	margin-top: 4px;
	cursor: pointer;
}

.emptyWrap {
	width: 100%;
	text-align: center;
	margin: 80px 0;
}

.emptyWrap>div {
	font-size: 24px;
	font-weight: 700;
	color: #999999;
}

#cart-goods-list {
	font-size: 14px;
	color: #666666;
}

.tr_title {
	font-size: 15px;
}

/deep/.el-pagination .el-pager .active {
	background: #EA7408 !important;
	color: #fff;
}

/deep/.el-pagination .el-pager li.number.active:hover {
	cursor: pointer;
	color: #fff !important;
}

/deep/.el-pagination .el-pager .active {
	background-color: #EA7408 !important;
}
</style>
